<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 
            省略号的写法 
            宽度一定不能少
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        */
        .container{
            width: 500px;
            border: 1px solid rebeccapurple;

            overflow: hidden;
            /* white-space: nowrap; */
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;

        }

        
    </style>
</head>

<body>
    <div class="container">
        北京14日确诊36人，特朗普没了，天气在下雨，我们在上课，好开心啊，还要上晚自习，还要写作业，还要背单词，还要打字，不能再说了，再说你们都要哭了，而我笑了
    </div>
</body>

</html>